<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <title><%= webpackConfig.name %></title>
  <style>
    /* Main styles */
    @import url(https://fonts.googleapis.com/css?family=Open+Sans:800);
    .text-one {
      fill: none;
      stroke-width: 3;
      stroke-linejoin: round;
      stroke-dasharray: 70 330;
      stroke-dashoffset: 0;
      -webkit-animation: stroke 6s infinite linear;
      animation: stroke 6s infinite linear;
    }
    .text-one:nth-child(5n + 1) {
      stroke: #F2385A;
      -webkit-animation-delay: -1.2s;
      animation-delay: -1.2s;
    }
    .text-one:nth-child(5n + 2) {
      stroke: #F5A503;
      -webkit-animation-delay: -2.4s;
      animation-delay: -2.4s;
    }
    .text-one:nth-child(5n + 3) {
      stroke: #E9F1DF;
      -webkit-animation-delay: -3.6s;
      animation-delay: -3.6s;
    }
    .text-one:nth-child(5n + 4) {
      stroke: #56D9CD;
      -webkit-animation-delay: -4.8s;
      animation-delay: -4.8s;
    }
    .text-one:nth-child(5n + 5) {
      stroke: #3AA1BF;
      -webkit-animation-delay: -6s;
      animation-delay: -6s;
    }

    @-webkit-keyframes stroke {
      100% {
        stroke-dashoffset: -400;
      }
    }
    @keyframes stroke {
      100% {
        stroke-dashoffset: -400;
      }
    }

    body {
      background-size: .2em 100%;

      margin: 0;
    }

  </style>
</head>
<body>
<div id="app">
  <div id="loader-wrapper">
    <svg viewBox="0 0 600 300">
      <!-- Symbol-->
      <symbol id="s-text" style="font:5em/1 Open Sans, Impact;">
        <text text-anchor="middle" x="50%" y="50%" dy=".35em">CAINAER</text>
      </symbol>
      <!-- Duplicate symbols-->
      <use class="text-one" xlink:href="#s-text"></use>
      <use class="text-one" xlink:href="#s-text"></use>
      <use class="text-one" xlink:href="#s-text"></use>
      <use class="text-one" xlink:href="#s-text"></use>
      <use class="text-one" xlink:href="#s-text"></use>
    </svg>
  </div>
</div>
</body>
</html>
